<X::DropdownList
  data-test-facet-dropdown-popover
  @items={{@facets}}
  @listIsOrdered={{true}}
  @offset={{hash mainAxis=3 crossAxis=-5}}
  @renderOut={{true}}
  class="facet-dropdown-popover"
  ...attributes
>
  <:anchor as |dd|>
    <dd.ToggleButton
      data-test-facet-dropdown-toggle
      data-test-facet={{dasherize @name}}
      class="focus:z-10 focus-visible:z-10 active:z-10"
      @text={{get-facet-label @name}}
      disabled={{this.isDisabled}}
    />
  </:anchor>
  <:item as |dd|>
    <dd.LinkTo
      data-test-facet-dropdown-link
      @query={{get-facet-query-hash @name dd.value dd.attrs.isSelected}}
    >
      <X::DropdownList::CheckableItem
        @value={{dd.value}}
        @shouldCapitalize={{eq @name "status"}}
        @count={{dd.attrs.count}}
        @isSelected={{dd.attrs.isSelected}}
      />
    </dd.LinkTo>
  </:item>
</X::DropdownList>
